<template>
	<view class="box"  style="width: 750rpx;overflow: hidden;background: #EFF1F3;" @click="external" @touchstart="handleTouchStart"
		@touchmove="handleTouchMove" @touchend="handleTouchEnd">
		<view class="tou fixed" :style="'padding-top:' + statusBarHeight1 + 'px'">
			<image style="width: 30rpx;height: 30rpx;left: 20rpx;" class="index-sousou"
				src="https://pic.bangbangtongcheng.com/static/bbcz/anchao-index-fanhui.png" mode="widthFix"
				@click="fanhui" />

			<image style="left: 65rpx;" class="index-logo"
				src="https://pic.bangbangtongcheng.com/static/bbcz/anchao-index-logo.png" mode="widthFix" />

			<image @click="sousuo" style="left: 320rpx;" class="index-sousou"
				src="https://pic.bangbangtongcheng.com/static/sousuo-6.png" mode="widthFix" />

			<image @click="fn" style="left: 400rpx;" class="index-sousou"
				src="https://pic.bangbangtongcheng.com/static/fenxiang-3.png" mode="widthFix" />
		</view>
			<scroll-view class="scroll-view" :scroll-y="modalName == '' || modalName == null" @scrolltolower="down" :bounces="false"
				:scroll-top="scrollTop1" @scroll="scroll" refresher-background="#f5f5f5">
				<view class="bannerBox" :class="scrollTop > 20 ? 'Ptop' : ''">
					<view class="banner">
						<swiper style="min-height: 0rpx;height: 458rpx;" class="screen-swiper" :indicator-dots="false"
							:circular="true" :autoplay="true" indicator-active-color="#ffffff" interval="5000"
							duration="500">
							<swiper-item v-for="(item, index) in bannerList" :key="index" @click="bannerD(item.id)">
								<image :src="imgUrl + item.image" mode="aspectFill" />
								<view class="byTitle"><span>{{ item.title }}</span></view>
							</swiper-item>
						</swiper>
					</view>
					<view class="semiCircle"></view>
				</view>
				<view class="cu-list grid col-4 no-border majorFunction" style="margin: 0 auto; width: 710rpx">
					<view class="cu-item">
						<image class="img"
							src="https://pic.bangbangtongcheng.com/static/bbcz/anzhao-index-fangyuan-icon.png" />
						<!-- <text style="font-size: 30rpx; color: #333333">房源信息</text> -->
					</view>
					<view class="cu-item" @click="tiaozhuan(2)">
						<image class="img"
							src="https://pic.bangbangtongcheng.com/static/bbcz/anchao-index-zaishouloupan-icon.png" />
						<!-- <text style="font-size: 30rpx; color: #333333">在售楼盘</text> -->
					</view>
					<view class="cu-item" @click="tiaozhuan(3)">
						<image class="img"
							src="https://pic.bangbangtongcheng.com/static/bbcz/anchao-index-zhongjieshangjia-icon.png" />
						<!-- <text style="font-size: 30rpx; color: #333333">中介</text> -->
					</view>
					<view class="cu-item" @click="tiaozhuan(4)">
						<image class="img"
							src="https://pic.bangbangtongcheng.com/static/bbcz/anchao-index-dituzhaofang.png" />
						<!-- <text style="font-size: 30rpx; color: #333333">地图找房</text> -->
					</view>
				</view>
				<view class="gonggao" style="display: none;">
					<image class="lis" src="https://pic.bangbangtongcheng.com/static/ptgg01.png" mode=""></image>
					<view class="li gong">
						<swiper style="min-height: 0rpx; height: 60rpx" :circular="true" :autoplay="true"
							:vertical="true" :display-multiple-items="WatchList.length > 2 ? 2 : WatchList.length"
							interval="3000" duration="500">
							<swiper-item v-for="(item, index) in WatchList" :key="index" @click="WatchNav(item.id)">
								<view class="text">{{ item.title }}</view>
							</swiper-item>
						</swiper>
					</view>
				</view>
				<view class="tit tit1" style="display: none;">
					<view>推荐房源</view>
					<!-- <view class="tg" @click="showType = !showType">
        排序
        <view class="triangle" :class="showType ? 'fan' : ''"></view>
        <view class="kuang" v-show="showType">
          <view class="item" @click="typeC(1)">按默认排序</view>
          <view class="item" @click="typeC(2)">按总价从低到高</view>
          <view class="item" @click="typeC(3)">按总价从高到低</view>
          <view class="item" @click="typeC(4)">按面积从小到大</view>
        </view>
      </view>-->
				</view>
				<view class="bigIndexQie">
					<view class="text" :class="switchRecomData == 1 ? 'active' : ''" @click="switchRecom(1)">推荐房源</view>
					<view class="text" :class="switchRecomData == 2 ? 'active' : ''" @click="switchRecom(2)">二手房</view>
					<view class="text" :class="switchRecomData == 3 ? 'active' : ''" @click="switchRecom(3)">未网签新房
					</view>
					<view class="text" :class="switchRecomData == 4 ? 'active' : ''" @click="switchRecom(4)">出租房</view>
				</view>
				<view class="titFilter" v-show="switchRecomData != 1">
					<view :class="userType == '' ? 'xuan view' : 'view'" @click.stop="xuanzhong('')">全部</view>
					<view :class="userType == '2' ? 'xuan view' : 'view'" @click.stop="xuanzhong(2)">个人</view>
					<view :class="userType == '1' ? 'xuan view' : 'view'" @click.stop="xuanzhong(1)">经纪人</view>
					<view class="sai" @click.stop="showModal" data-target="DrawerModalR">
						筛选
						<span>▼</span>
					</view>
				</view>

				<view class="cardList">
					<view class="cardListLi" v-for="(item, index) in Recommend" :key="index" @click="details(item.id)">
						<view class="liTopBox">
							<image mode="aspectFit" class="image"
								:src="item.display_diagram ? item.display_diagram : imgUrl + item.house_image" />
							<view class="li_1">
								<view class="tit">
									<span class="tagLabel">{{
									item.transaction_type == 1
										? "出租房"
										: item.new_old == 1
											? "新房"
											: "二手房"
								}}</span>
									{{ item.title }}
								</view>
								<view class="">
									<view class="neirong_1">
										<view class="neir_css">
											<image v-if="item.region" class="cardImageIcon"
												src="https://pic.bangbangtongcheng.com/static/bbcz/index-location.png">
											</image>{{ item.region }}
										</view>
										<view class="neir_css">
											<image v-if="item.cell_name" class="cardImageIcon"
												src="https://pic.bangbangtongcheng.com/static/bbcz/index-xiaoqu.png">
											</image>{{ item.cell_name || "" }}
										</view>
									</view>
									<view class="neirong_1">
										<view class="neir_css">
											<image class="cardImageIcon" v-if="item.FLOOR"
												src="https://pic.bangbangtongcheng.com/static/bbcz/index-louceng.png">
											</image>
											{{ item.FLOOR ? item.FLOOR.split("|")[0] + "层/共" + item.FLOOR.split("|")[1] + "层" : "" }}
										</view>
										<view class="neir_css">
											<image v-if="item.house_type" class="cardImageIcon"
												src="https://pic.bangbangtongcheng.com/static/bbcz/index-huxing.png">
											</image>{{ item.house_type || "" }}
										</view>
									</view>
									<view class="neirong_1">
										<view class="neir_css" style>
											<image v-if="item.AREA || item.area" class="cardImageIcon"
												src="https://pic.bangbangtongcheng.com/static/bbcz/index-pingfang.png">
											</image>{{ item.AREA || item.area }}㎡
										</view>
									</view>
									<view class="neirong_1" style="text-align: right;">
										<view class="price neir_css" v-if="item.transaction_type == 2">
											{{ Math.floor(item.price) }}万
										</view>
										<view class="price neir_css"
											v-if="item.transaction_type == 1 && item.price <= 10000">
											{{Math.floor(item.price) }}元{{ item.transaction_type == 1 ? '/月' : '' }}
										</view>
										<view class="price neir_css"
											v-if="item.transaction_type == 1 && item.price > 10000">
											{{ Math.floor(item.price) / 10000 }}万元
										</view>
									</view>
								</view>
								<!-- <view class="">
							<view class="neirong_1">
								<view class="neir_css">
									<image v-if="item.region" class="cardImageIcon"
										src="https://pic.bangbangtongcheng.com/static/bbcz/index-location.png">
									</image>{{ item.region }}
								</view>
								<view class="neir_css">
									<image v-if="item.cellName" class="cardImageIcon"
										src="https://pic.bangbangtongcheng.com/static/bbcz/index-xiaoqu.png">
									</image>{{ item.cell_name || "" }}
								</view>
							</view>
							<view class="neirong_1">
								<view class="neir_css">
									<image v-if="item.floor" class="cardImageIcon"
										src="https://pic.bangbangtongcheng.com/static/bbcz/index-louceng.png">
									</image>{{ item.FLOOR }}
								</view>
								<view class="neir_css">
									<image v-if="item.houseType" class="cardImageIcon"
										src="https://pic.bangbangtongcheng.com/static/bbcz/index-huxing.png">
									</image>{{ item.house_type || "" }}
								</view>
							</view>
							<view class="neirong_1" style="text-align: right;">
								<view class="price neir_css" v-if="item.transaction_type == 2">{{ item.price }}万</view>
								<view class="price neir_css" v-if="item.transaction_type == 1 && item.price <= 10000">
									{{ item.price }}元
								</view>
								<view class="price neir_css" v-if="item.transaction_type == 1 && item.price > 10000">
									{{ item.price / 10000 }}万元
								</view>
								<view class="neir_css" style>{{ item.AREA || item.area }}㎡</view>
							</view>
						</view> -->
							</view>
						</view>
						<!-- <view style="height: 1rpx;background: #EBEBED;margin-top: 30rpx;"></view>
					<view class="liBottomBox">
						<view class="personalInformation_left">
							<image class="personalInformation_image" v-if="item.userImage" :src="item.userImage"
								mode="">
							</image>
							<image class="personalInformation_image" v-else
								src="https://pic.bangbangtongcheng.com/static/my/header.png" mode=""></image>
						</view>
						<view style="margin-left: 10rpx;">
							<image class="qy-gr-label" v-if="item.enterpriseName"
								src="https://pic.bangbangtongcheng.com/static/bbcz/index-label-qiye.png">
							</image>
							<image class="qy-gr-label" v-else
								src="https://pic.bangbangtongcheng.com/static/bbcz/index-label-geren.png">
							</image>
						</view>
						<view class="personalInformation_right">
							<view class="GR">
								<span class="name">{{
					  item.nikeName ? item.nikeName : "未命名用户"
					}}</span>
							</view>
						</view>
					</view> -->
					</view>
				</view>
				<view v-if="Recommend.length == 0" class="none">
					<image src="https://pic.bangbangtongcheng.com/static/none.png" mode="widthFix" />
					<view>没有更多数据了</view>
				</view>
				<view class="down" v-show="Recommend.length != 0 && !downStatus">没有更多了</view>
				<view class="zbc" v-if="zbc">
					<view class="tan">
						<view class="text">商家已将您标记为离职，是否同意？</view>
						<view class="xiao" @click="guan">稍后</view>
						<view class="tong" @click="agreelz">同意</view>
						<view class="guan" @click="guan">×</view>
					</view>
				</view>
			</scroll-view>
		
		<uniBall></uniBall>
		<view @click="totop">
			<back-top :scrollTop="scrollTop" :isClick="false"></back-top>
		</view>
		<view class="cu-modal drawer-modal justify-end" :class="modalName == 'DrawerModalR' ? 'show' : ''" >
			<scroll-view scroll-y="true" class="pop-scroll">
				<view class="tittit" :style="[
					{
						top: 'calc(' + CustomBar1 + 'px' + ' + 36px )',

					},
				]">
					<view @click="hideModal()">×</view>筛选
				</view>
				<view class="cu-dialog basis-lg" @tap.stop :style="[
					{
						top: 'calc(' + CustomBar1 + 'px' + ' + 36px )',
						height: 'calc(100vh - ' + CustomBar1 + 'px - 36px)',
					},
				]">
					<view class="cu-list menu text-left">
						<view style="height: 80rpx;">
							<!-- <view @click.stop="hideModal()">×</view>筛选 -->
						</view>
						<view class="leibie">
							类别
							<span style="color: #999999">（请选择类别）</span>
							<view class="list">
								<view @click.stop="type1Click(index)" :class="item.active ? 'li xuan' : 'li'"
									v-for="(item, index) in type1" :key="index">{{ item.valueName }}</view>
							</view>
						</view>
						<view class="quyu">
							户型
							<span style="color: #999999">（请选择户型）</span>
							<view class="list">
								<view @click.stop="type3Click(index)" class="li" :class="item.active ? 'li xuan' : 'li'"
									v-for="(item, index) in type3" :key="index">{{ item.valueName }}</view>
							</view>
						</view>
						<view class="quyu">
							区域
							<span style="color: #999999">（请选择区域）</span>
							<view class="list">
								<view @click.stop="type7Click(index)" class="li" :class="item.active ? 'li xuan' : 'li'"
									v-for="(item, index) in type7" :key="index">{{ item.valueName }}</view>
							</view>
						</view>
						<view class="jiage">
							{{ switchRecomData == 4 ? '租金' : '价格' }}
							<span v-if="switchRecomData == 4" style="color: #999999">（请选择租金）</span>
							<span v-else style="color: #999999">（请选择价格）</span>
							<view class="list" v-if="switchRecomData == 4">
								<view @click="type12Click(index)" class="li" :class="item.active ? 'li xuan' : 'li'"
									v-for="(item, index) in type12" :key="index">{{ item.valueName }}</view>
							</view>
							<view class="list" v-else>
								<view @click="type8Click(index)" class="li" :class="item.active ? 'li xuan' : 'li'"
									v-for="(item, index) in type8" :key="index">{{ item.valueName }}</view>
							</view>
						</view>
						<view class="mianji">
							面积
							<span style="color: #999999">（请选择面积）</span>
							<view class="list">
								<view @click.stop="type9Click(index)" class="li" :class="item.active ? 'li xuan' : 'li'"
									v-for="(item, index) in type9" :key="index">{{ item.valueName }}</view>
							</view>
						</view>
						<view class="loucen">
							楼层
							<span style="color: #999999">（请选择楼层）</span>
							<view class="list">
								<view @click.stop="type10Click(index)" class="li"
									:class="item.active ? 'li xuan' : 'li'" v-for="(item, index) in type10"
									:key="index">{{ item.valueName }}</view>
							</view>
						</view>
					</view>
				</view>
				<view class="di">
					<view class="div l" @click.stop="cz">重置</view>
					<view class="div r" @click.stop="sx">确定</view>
				</view>
			</scroll-view>
		</view>
	</view>
</template>

<script>
	import {
		mapGetters
	} from "vuex";
	let statusBarHeight;
	//#ifdef H5
	import wxshare from "@/utils/index.js";
	statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 10 + 44;
	//#endif
	// #ifdef APP-PLUS
	statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 10 + 44;
	//  #endif
	// #ifdef MP-WEIXIN
	statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 5 + 88;
	//  #endif
	export default {
		data() {
			return {
				modalName: "",
				switchRecomData: 1,
				statusBarHeight,
				zbc: false,
				pageSize: 10,
				pageNo: 1,
				trigger: false,
				downStatus: true,
				upStatus: true,
				bannerList: [],
				Recommend: [],
				WatchList: [],
				imgUrl: this.$imgSrc,
				showType: false,
				orderSort: "1",
				scrollTop: 0,
				scrollTop1: 0,
				userInfo: uni.getStorageSync("Pduser"),
				phone: "",
				isViewVisible: true,
				newOld: '',
				userType: "",
				type1: [],
				type3: [],
				type7: [],
				type8: [],
				type9: [],
				type10: [],
				type12: [],
				houseType: "",
				type: "",
				region: "",
				price: "",
				area: "",
				floor: "",
				CustomBar1: "",
			};
		},
		components: {},
		computed: {
			...mapGetters(["statusBarHeight1", "userinfo"]),
		},
		onShow() {
			this.userInfo = uni.getStorageSync("Pduser");
			this.phone = this.userInfo.phone;
			if (this.phone) {
				this.getUserPhone();
				this.$nextTick(() => {
					//this.$refs.viewTabbar.fnc();
				});
			}
			this.zbc = false;
			clearTimeout(time);
			var time = setTimeout(() => {
				if (getApp().globalData.confirm) {
					this.zbc = true;
				}
				clearTimeout(time);
			}, 1000);
		},
		async onPullDownRefresh() {
			this.Recommend = [];
			this.pageNo = 1;
			this.downStatus = true;
			if (this.upStatus) {
				this.trigger = true;
				await this.getRecommend();
			}
		},
		onReachBottom() {
			this.down();
		},
		async onLoad(options) {
			uni.hideTabBar();
			if (options.wxOpenid) {
				let userInfo = {
					openid: options.wxOpenid,
					headimgurl: options.image,
					nickname: options.nickname,
					openIdH5: options.openId,
				};
				uni.setStorageSync("userInfo", userInfo);
			}
			this.getType();
			this.CustomBar1 = this.CustomBar;
			await this.getBanner();
			await this.getWatch();
			await this.getRecommend();
			/* #ifdef H5 */
			this.jinzhi();
			/* #endif */
			const user = uni.getStorageSync("Pduser");

			console.log("onLaunch");
		},
		filters: {
			nums(val) {
				return val.toFixed(2);
			},
		},
		// onPageScroll: function (Object) {

		// },
		onPageScroll(Object) {
			this.scrollTop = Object.scrollTop;
			//console.log(this.modalName)
			console.log("onPageScroll", this.scrollTop)
		},
		methods: {
			moveHandle(){
				console.log("moveHandle")
			},
			down() {
				if (this.downStatus) {
					this.pageNo++;
					this.getRecommend();
				}
			},
			external() {
				this.modalName = null;
				console.log("external", this.modalName)
			},
			scroll(e) {
				this.oldScrollTop = e.detail.scrollTop;
				this.scrollTop = e.detail.scrollTop;
			},
			hideModal(e) {
				this.modalName = null;
				console.log("hideModal", this.modalName)
			},
			switchRecom(index) {
				this.switchRecomData = index
				this.Recommend = [];
				this.pageNo = 1;
				this.userType = '';
				this.getRecommend();
			},
			xuanzhong(num) {
				this.userType = num;
				this.Recommend = [];
				this.pageNo = 1;
				this.downStatus = true;
				// this.getRecommend();
				this.cz();
			},
			fanhui() {
				uni.navigateBack({
					delta: 1,
				});
			},
			sousuo() {
				// if (!this.userinfo.phone) {
				// 	uni.showToast({
				// 		title: "请登录",
				// 		icon: "none",
				// 		mask: true
				// 	});
				// 	return;
				// }
				uni.navigateTo({
					url: "/pages_search/search?searchlogType=1",
				});
			},
			getUserPhone() {
				let that = this;
				this.$myRequest
					.get("/mob/login/getUserInfoByPhone", {
						phone: this.phone,
					})
					.then((res) => {
						this.userInfo = res.userInfo;
						uni.setStorageSync("Pduser", res.userInfo);
						that.$store.dispatch("user/login", res.userInfo);
					});
			},
			//同意离职
			agreelz() {
				this.zbc = false;
				getApp().globalData.confirm = false;
				if (this.userInfo.businessType == 1) {
					this.$myRequest
						.post("/mob/user/confirmResignation", {
							id: this.userInfo.id,
						})
						.then((data) => {
							if (data.code == 200) {
								this.guan();
							}
						});
				} else {
					this.$myRequest
						.post("/api/mobile/vehicleOwner/confirmResignation", {
							userId: this.userInfo.id,
						})
						.then((data) => {
							if (data.code == 200) {
								this.guan();
							}
						});
				}
			},
			jinzhi() {
				let _this = this;
				let param = window.location.href.split("#")[0];
				uni.request({
					method: "post",
					data: {
						url: param,
					},
					header: {
						"content-type": "application/x-www-form-urlencoded",
					},
					url: "https://www.bangbangtongcheng.com/conven//mob/login/getJsTicket.do",
					success(re) {
						_this.setWxShare(re.data);
					},
				});
			},
			setWxShare(data) {
				let _this = this;
				wxshare.config({
					debug: false, //是否打开调试
					appId: data.appId, // 公众号的唯一标识
					timestamp: data.timestamp, // 生成签名的时间戳
					nonceStr: data.nonce, // ，生成签名的随机串
					signature: data.signature, // 签名
					jsApiList: [
						"updateAppMessageShareData",
						"updateTimelineShareData",
						"openLocation",
					],
				});
				wxshare.ready(function() {
					//分享给朋友
					// console.log("aaaaaaaa");
					wxshare.updateAppMessageShareData({
						title: "帮帮同城", // 分享标题
						desc: "找房就用帮帮同城!", // 分享描述
						link: `https://www.bangbangtongcheng.com/conven//login/Wxlogin.do`, // 当前页面链接pp
						imgUrl: "https://pic.bangbangtongcheng.com/6a1ff26f7e554c03aef0bdf118e4741a.jpeg", // 分享图标
						success: function() {
							//分享成功回调
						},
						cancel: function() {
							//取消分享回调
						},
					});
					wxshare.updateTimelineShareData({
						title: "帮帮同城", // 分享标题
						desc: "找房就用帮帮同城!", // 分享描述
						link: `https://www.bangbangtongcheng.com/conven//login/Wxlogin.do`, // 当前页面链接pp
						imgUrl: "https://pic.bangbangtongcheng.com/6a1ff26f7e554c03aef0bdf118e4741a.jpeg", // 分享图标
						success: function() {},
						cancel: function() {},
					});
				});
			},
			onShareAppMessage: function(res) {
				let that = this;
				// console.log(that.imgUrl + that.data.logo);
				if (res.from === "menu") {}
				return {
					title: "帮帮同城",
					path: "/pages/index/index",
					desc: "找房就用帮帮同城",
					imageUrl: "https://pic.bangbangtongcheng.com/6a1ff26f7e554c03aef0bdf118e4741a.jpeg",
				};
			},
			onShareTimeline() {
				return {
					title: "帮帮同城",
					path: "/pages/index/index",
					imageUrl: "https://pic.bangbangtongcheng.com/6a1ff26f7e554c03aef0bdf118e4741a.jpeg",
				};
			},
			bannerD(id) {
				console.log(id);
				if (id == undefined) {
					uni.navigateTo({
						url: "/pages/index/bannerDetails?id=" + id,
					});
				} else {
					uni.navigateTo({
						url: "/pages_index/Watch/details?id=" + id,
					});
				}
			},
			guan() {
				this.zbc = false;
				getApp().globalData.confirm = false;
			},
			down() {
				if (this.downStatus) {
					this.pageNo++;
					console.log(2222);
					this.getRecommend();
				}
			},
			async up() {
				this.Recommend = [];
				this.pageNo = 1;
				this.downStatus = true;
				if (this.upStatus) {
					this.trigger = true;
					await this.getRecommend();
				}
			},
			handleTouchStart(event) {
				console.log("@@@")
				// 记录开始触摸的Y坐标
				this.startY = event.touches[0].clientY;
			},
			handleTouchMove(event) {
				// 当前触摸的Y坐标
				const currentY = event.touches[0].clientY;
				// 计算滑动的距离
				const distance = currentY - this.startY;
				// 根据滑动的距离判断是上滑还是下滑
				if (distance > 6) {
					// 上滑操作
					this.isViewVisible = true;
				} else if (distance < -6) {
					// 下滑操作
					this.isViewVisible = false;
				}
			},
			handleTouchEnd() {
				// 可以在这里做一些触摸结束后的处理
			},
			bannerD(id) {
				uni.navigateTo({
					url: "/pages/index/bannerDetails?id=" + id,
				});
			},
			// totop() {
			// 	uni.pageScrollTo({
			// 		scrollTop: 0,
			// 		duration: 300,
			// },
			totop() {
				this.scrollTop1 = this.oldScrollTop;
				console.log(this.scrollTop1)
				this.$nextTick(() => {
					this.scrollTop1 = 0;
				});
			},
			WatchNav(id) {
				uni.navigateTo({
					url: "/pages_index/Watch/details?id=" + id,
				});
			},
			guan() {
				this.zbc = false;
			},
			tiaozhuan(num) {
				if (num == 1) {
					uni.navigateTo({
						url: "/pages_houses/housing/index",
					});
				} else if (num == 2) {
					uni.navigateTo({
						url: "/pages_houses/houses/index",
					});
				} else if (num == 3) {
					uni.navigateTo({
						url: "/pages/intermediary/index",
					});
				} else if (num == 4) {
					console.log(44444);
					uni.navigateTo({
						// #ifdef APP
						url: "/pages/index/Map",
						//#endif
						// #ifndef APP
						url: "/pages_index/mapHouse",
						//#endif
					});
				}
			},
			fn() {
				let _this = this;
				uni.showActionSheet({
					itemList: ["分享到微信好友", "分享到微信朋友圈"],
					success: (res) => {
						let wsxcene = null;
						if (res.tapIndex == 0) {
							//分享到好友 可以发送小程序
							wsxcene = "WXSceneSession";
							uni.share({
								provider: "weixin",
								scene: wsxcene,
								type: 5,
								title: item.userInfo.nikeName || "未命名用户",
								imageUrl: item.userInfo.image ||
									"https://pic.bangbangtongcheng.com/static/my/header.png",
								miniProgram: {
									id: "gh_c8b17811efca",
									path: "pages_index/bigIndex",
									type: 0,
									webUrl: "https://www.bangbangtongcheng.com/conven_web/#/pages_index/bigIndex",
								},
								// summary: "我正在看，" + this.data.title + "赶紧跟我一起来查看！",
								success: function(res) {
									console.log("success:" + JSON.stringify(res));
								},
								fail: function(err) {
									console.log("fail:" + JSON.stringify(err));
								},
							});
						} else {
							uni.downloadFile({
								url: this.userInfo.image ||
									"https://pic.bangbangtongcheng.com/static/my/header.png", //仅为示例，并非真实的资源
								success: (res) => {
									if (res.statusCode === 200) {
										let name = res.tempFilePath.substr(
											res.tempFilePath.lastIndexOf("/") + 1
										); //截取文件名
										plus.zip.compressImage({
												src: res.tempFilePath, //下载完图片的临时路径
												dst: "_doc/photoData/" + name, //存储压缩完图片的临时路径
												overwrite: true, //再次压缩会覆盖掉上次的目录
												width: "150px", //缩放图片的宽度
												height: "100px", //缩放图片的高度
												quality: 5, //压缩图片质量,值越低,图片占内存越低
											},
											(event) => {
												//压缩成功
												wsxcene = "WXSceneTimeline"; //分享到朋友圈 只能H5 或者图片
												uni.share({
													provider: "weixin",
													scene: wsxcene,
													type: 0,
													title: item.userInfo.nikeName ||
														"未命名用户",
													href: "https://www.bangbangtongcheng.com/conven_web/#/pages_index/bigIndex",
													imageUrl: event.target,
													summary: "我正在看，" + item.userInfo
														.nikeName ||
														"未命名用户" + "赶紧跟我一起来查看！",
													success: function(res) {
														console.log("success:" +
															JSON.stringify(res)
														);
													},
													fail: function(err) {
														console.log("fail:" + JSON
															.stringify(err));
													},
												});
											},
											(error) => {
												//压缩失败
												uni.showToast({
													title: "压缩失败",
													icon: "none",
												});
											}
										);
									}
								},
							});
						}
					},
					fail: function(res) {
						console.log(res.errMsg);
					},
				});
			},
			details(id) {
				uni.navigateTo({
					url: "/pages_houses/housing/used/houseDetails?id=" + id,
				});
			},
			getRecommend() {
				this.upStatus = false;
				console.log('this.switchRecomData', this.switchRecomData)
				var data = null;
				if (this.switchRecomData == 1) {
					data = {
						pageSize: this.pageSize,
						pageNo: this.pageNo,
						isShow: 1,
						upStatus: 1,
						examineStatus: 2,
						isLz: "0",
						userType: this.userType,
						orderSort: this.orderSort,
						type: this.type,
						region: this.region,
						price: this.price,
						area: this.area,
						floor: this.floor,
						houseType: this.houseType
					}
				}
				if (this.switchRecomData == 2 || this.switchRecomData == 3) {
					if (this.switchRecomData == 2) {
						this.newOld = 2
					}
					if (this.switchRecomData == 3) {
						this.newOld = 1
					}

					data = {
						pageSize: this.pageSize,
						pageNo: this.pageNo,
						orderSort: this.orderSort,
						newOld: this.newOld,
						upStatus: 1,
						examineStatus: 2,
						userType: this.userType,
						type: this.type,
						region: this.region,
						price: this.price,
						area: this.area,
						floor: this.floor,
						transactionType: 2,
						houseType: this.houseType,
						isLz: "0"
					}
				}
				if (this.switchRecomData == 4) {
					data = {
						pageSize: this.pageSize,
						pageNo: this.pageNo,
						orderSort: this.orderSort,
						userType: this.userType,
						type: this.type,
						region: this.region,
						price: this.price,
						area: this.area,
						floor: this.floor,
						transactionType: "1",
						upStatus: 1,
						examineStatus: 2,
						houseType: this.houseType,
						isLz: "0",
					}
				}

				this.$myRequest
					.get("/mob/home/getHouseInfo", data)
					.then((res) => {
						if (!res.list.length) {
							this.downStatus = false;
						}
						this.upStatus = true;
						this.trigger = false;
						res.list.forEach((el) => {
							if (el.house_image) {
								el.house_image = el.house_image.split("|")[0];
							}
							// if (el.hasOwnProperty("FLOOR")) {
							// 	if (el.FLOOR.indexOf("|") != -1) {
							// 		el.FLOOR =
							// 			el.FLOOR.split("|")[0] + "层/共" + el.FLOOR.split("|")[1] + "层";
							// 	} else {
							// 		el.FLOOR = "";
							// 	}
							// }
						});
						this.Recommend = this.Recommend.concat(res.list);
						uni.stopPullDownRefresh();
						console.log(this.Recommend);
					});
			},
			showModal(e) {
				this.modalName = e.currentTarget.dataset.target;
				console.log("showModal", this.modalName);
			},
			getType() {
				let that = this;
				this.$myRequest
					.get("/mob/home/getDictionaries", {
						pageNo: 1,
						pageSize: 10,
						type: "9,7,12,1,3,10,8",
					})
					.then((res) => {
						console.log(res);
						res.list.forEach((el) => {
							el.active = false;
							if (el.type == 1) {
								that.type1.push(el);
							} else if (el.type == 3) {
								that.type3.push(el);
							} else if (el.type == 7) {
								that.type7.push(el);
							} else if (el.type == 8) {
								that.type8.push(el);
							} else if (el.type == 9) {
								that.type9.push(el);
							} else if (el.type == 10) {
								that.type10.push(el);
							} else if (el.type == 12) {
								that.type12.push(el);
							}
						});
					});
			},
			cz() {
				this.type1.forEach(el => {
					el.active = false;
				});
				this.type7.forEach(el => {
					el.active = false;
				});
				this.type8.forEach(el => {
					el.active = false;
				});
				this.type12.forEach(el => {
					el.active = false;
				});
				this.type9.forEach(el => {
					el.active = false;
				});
				this.type10.forEach(el => {
					el.active = false;
				});
				this.type3.forEach(el => {
					el.active = false;
				});
				this.houseType = "";
				this.type = "";
				this.region = "";
				this.price = "";
				this.area = "";
				this.floor = "";
				this.Recommend = [];
				this.pageNo = 1;
				this.downStatus = true;
				this.getRecommend();
			},
			sx() {
				let that = this;
				this.houseType = "";
				this.type = "";
				this.region = "";
				this.price = "";
				this.area = "";
				this.floor = "";
				this.type1.forEach(el => {
					if (el.active == true) {
						that.type = el.valueNum;
					}
				});
				this.type7.forEach(el => {
					if (el.active == true) {
						that.region = el.valueName;
					}
				});
				this.type3.forEach(el => {
					if (el.active == true) {
						that.houseType = el.valueName;
					}
				});
				this.type8.forEach(el => {
					if (el.active == true) {
						that.price = el.valueName;
					}
				});
				this.type12.forEach(el => {
					if (el.active == true) {
						that.price = el.valueName;
					}
				});
				this.type9.forEach(el => {
					if (el.active == true) {
						that.area = el.valueName;
					}
				});
				this.type10.forEach(el => {
					if (el.active == true) {
						that.floor = el.value;
					}
				});
				this.Recommend = [];
				this.pageNo = 1;
				this.downStatus = true;
				this.modalName = null;
				this.getRecommend();
			},
			type1Click(index) {
				let that = this;
				this.type1.forEach((el, index1) => {
					if (index == index1) {
						that.$set(that.type1[index1], "active", !el.active);
					} else {
						that.type1[index1].active = false;
					}
				});
			},
			type7Click(index) {
				let that = this;
				this.type7.forEach((el, index1) => {
					if (index == index1) {
						that.$set(that.type7[index1], "active", !el.active);
					} else {
						that.type7[index1].active = false;
					}
				});
			},
			type3Click(index) {
				let that = this;
				this.type3.forEach((el, index1) => {
					if (index == index1) {
						that.$set(that.type3[index1], "active", !el.active);
					} else {
						that.type3[index1].active = false;
					}
				});
			},
			type8Click(index) {
				let that = this;
				this.type8.forEach((el, index1) => {
					if (index == index1) {
						that.$set(that.type8[index1], "active", !el.active);
					} else {
						that.type8[index1].active = false;
					}
				});
			},
			type12Click(index) {
				let that = this;
				this.type12.forEach((el, index1) => {
					if (index == index1) {
						that.$set(that.type12[index1], "active", !el.active);
					} else {
						that.type12[index1].active = false;
					}
				});
			},
			type9Click(index) {
				let that = this;
				this.type9.forEach((el, index1) => {
					if (index == index1) {
						that.$set(that.type9[index1], "active", !el.active);
					} else {
						that.type9[index1].active = false;
					}
				});
			},
			type10Click(index) {
				let that = this;
				this.type10.forEach((el, index1) => {
					if (index == index1) {
						that.$set(that.type10[index1], "active", !el.active);
					} else {
						that.type10[index1].active = false;
					}
				});
			},
			getBanner() {
				this.$myRequest
					.get("/mob/home/getBanner", {
						type: "1",
					})
					.then((res) => {
						this.bannerList = res.list;
					});
			},
			typeC(type) {
				this.Recommend = [];
				this.orderSort = type;
				this.pageNo = 1;
				this.getRecommend();
			},
			getWatch() {
				this.$myRequest
					.get("/mob/home/getWatch", {
						pageSize: 10,
						pageNo: 1,
						auditStatus: 2,
					})
					.then((res) => {
						this.WatchList = res.list;
					});
			},
		},
	};
</script>


<style lang="less" scoped>
	::v-deep .uni-scroll-view,.uni-scroll-view-content{
		overscroll-behavior: none;
	}
	::v-deep .uni-scroll-view-content{
	overscroll-behavior: none;
	}
	.scroll-view {
		//height: calc(100% - 58rpx - 24rpx) !important;
		height: 100vh;
		//background-color: red;
	}

	.pop-scroll {
		position: relative;
		 overflow-y: scroll;
		max-height: calc(100vh - var(--CustomBar1) - 36px);
	}

	.cu-dialog {
		max-width: 100%;
		width: 600rpx;
	}

	.basis-lg {
		flex-basis: 600rpx;
		overflow: auto;
	}
	
	.tit_list {
			//padding: 32rpx 30rpx calc(env(safe-area-inset-bottom) / 2);
	}

	.cu-list {
		padding-bottom: calc(98rpx + env(safe-area-inset-bottom) / 2);

		.tit {
			position: relative;
			width: 100%;
			height: 80rpx;
			text-align: center;
			line-height: 80rpx;
			font-size: 30rpx;
			border-bottom: 2rpx solid #cccccc;

			view {
				position: absolute;
				top: 0rpx;
				left: 20rpx;
				color: #999999;
				font-size: 54rpx;
				font-weight: 100;
			}
		}

		.leibie {
			margin-top: 40rpx;
			font-size: 28rpx;
			margin-left: 40rpx;

			.list {
				width: 100%;
				margin-top: 24rpx;

				.li {
					display: inline-block;
					text-align: center;
					width: 154rpx;
					height: 60rpx;
					line-height: 60rpx;
					background: #f2f2f2;
					border-radius: 30rpx;
					margin-right: 24rpx;
					margin-bottom: 24rpx;
				}

				.xuan {
					background: #64b6a8;
					color: #fff;
				}
			}
		}

		.quyu {
			margin-top: 40rpx;
			font-size: 28rpx;
			margin-left: 40rpx;

			.list {
				width: 100%;
				margin-top: 24rpx;

				.li {
					display: inline-block;
					text-align: center;
					width: 154rpx;
					height: 60rpx;
					line-height: 60rpx;
					background: #f2f2f2;
					border-radius: 30rpx;
					margin-right: 24rpx;
					margin-bottom: 24rpx;
				}

				.xuan {
					background: #64b6a8;
					color: #fff;
				}
			}
		}

		.jiage {
			margin-top: 40rpx;
			font-size: 28rpx;
			margin-left: 40rpx;

			.list {
				width: 100%;
				margin-top: 24rpx;

				.li {
					display: inline-block;
					text-align: center;
					width: 214rpx;
					height: 60rpx;
					line-height: 60rpx;
					background: #f2f2f2;
					border-radius: 30rpx;
					margin-right: 24rpx;
					margin-bottom: 24rpx;
				}

				.xuan {
					background: #64b6a8;
					color: #fff;
				}
			}
		}

		.mianji {
			margin-top: 40rpx;
			font-size: 28rpx;
			margin-left: 40rpx;

			.list {
				width: 100%;
				margin-top: 24rpx;

				.li {
					display: inline-block;
					text-align: center;
					width: 214rpx;
					height: 60rpx;
					line-height: 60rpx;
					background: #f2f2f2;
					border-radius: 30rpx;
					margin-right: 24rpx;
					margin-bottom: 24rpx;
				}

				.xuan {
					background: #64b6a8;
					color: #fff;
				}
			}
		}

		.loucen {
			margin-top: 40rpx;
			font-size: 28rpx;
			margin-left: 40rpx;

			.list {
				width: 100%;
				margin-top: 24rpx;

				.li {
					display: inline-block;
					text-align: center;
					width: 154rpx;
					height: 60rpx;
					line-height: 60rpx;
					background: #f2f2f2;
					border-radius: 30rpx;
					margin-right: 24rpx;
					margin-bottom: 24rpx;
				}

				.xuan {
					background: #64b6a8;
					color: #fff;
				}
			}
		}
	}

	.di {
		position: absolute;
		transform: translateY(0rpx);
		width: 100%;
		bottom: 0;
		left: 75rpx;

		.div {
			padding-bottom: calc(env(safe-area-inset-bottom) / 2);
			height: calc(env(safe-area-inset-bottom) / 2 + 98rpx);
			display: inline-block;
			width: 300rpx;
			text-align: center;
			line-height: 98rpx;
			font-size: 30rpx;
		}

		.l {
			background: #e0e0e0;
		}

		.r {
			background: #64b6a8;
			color: #fff;
		}
	}

	.tittit {
		position: fixed;
		top: 0;
		right: 0;
		background-color: #f8f8f8;
		z-index: 9999;
		max-width: 100%;
		width: 600rpx;
		transition-duration: 0.3s;
		transform: translateX(100%);

		text-align: center;
		line-height: 80rpx;
		font-size: 30rpx;
		border-bottom: 2rpx solid #cccccc;

		view {
			position: absolute;
			top: 0rpx;
			left: 20rpx;
			color: #999999;
			font-size: 54rpx;
			font-weight: 100;
		}
	}

	.show .tittit {
		transform: translateX(0%);
	}

	.titFilter {
		position: relative;
		margin-bottom: 20rpx;
		padding: 0rpx 20rpx;

		.view {
			display: inline-block;
			width: 110rpx;
			height: 50rpx;
			background: #FFFFFF;
			border-radius: 10rpx;
			border: 1rpx solid #999999;
			text-align: center;
			line-height: 50rpx;
			color: #666666;
			margin-right: 24rpx;
			font-size: 24rpx;
		}

		.xuan {
			color: #fff;
			background: #E7F5F4;
			border-radius: 10rpx;
			border: 1rpx solid #0FA291;
			color: #0FA291;
		}

		.sai {
			position: absolute;
			font-size: 24rpx;
			top: 4rpx;
			right: 30rpx;

			span {
				margin-left: 8rpx;
				font-size: 20rpx;
			}
		}
	}

	.cardImageIcon {
		width: 24rpx !important;
		height: 24rpx !important;
		margin-right: 6rpx !important;
	}

	.qy-gr-label {
		width: 74rpx;
		height: 30rpx;
		margin-top: 8rpx;
	}

	.bigIndexQie {
		margin: 20rpx 0rpx;
		margin-bottom: 30rpx;
		display: flex;
		align-items: center;
		// height: 137rpx;
		margin-left: 40rpx;

		.text {
			font-size: 28rpx;
			font-weight: 400;
			color: #666666;
			margin-right: 50rpx;
		}

		.active {
			// color: #64b6a8;
			color: #000000;
			font-size: 32rpx;
			position: relative;
			padding-bottom: 6rpx;
		}

		.active::before {
			content: "";
			display: block;
			width: 30rpx;
			height: 6rpx;
			background: #64b6a8;
			border-radius: 3rpx;
			position: absolute;
			bottom: -8rpx;
			left: 50%;
			transform: translateX(-50%);
		}
	}

	.majorFunction {
		padding: 0rpx;
		background-color: transparent;
		display: flex;
		justify-content: space-between;
		padding: 0rpx !important;

		.cu-item {
			width: 162rpx;
			height: 128rpx;
			padding: 0rpx !important;

			image {
				width: 162rpx;
				height: 128rpx;
			}
		}

	}

	.zbc {
		position: fixed;
		width: 100%;
		top: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, 0.3);
		z-index: 99999;

		.tan {
			position: absolute;
			width: 600rpx;
			height: 300rpx;
			background-color: #fff;
			border-radius: 10rpx;
			top: 34%;
			left: 75rpx;

			.text {
				width: 100%;
				text-align: center;
				margin-top: 80rpx;
				font-size: 36rpx;
			}

			.xiao {
				position: absolute;
				width: 160rpx;
				height: 60rpx;
				background: #ffffff;
				border: 2rpx solid #64b6a8;
				border-radius: 37rpx;
				left: 118rpx;
				bottom: 54rpx;
				text-align: center;
				line-height: 60rpx;
				color: #64b6a8;
			}

			.tong {
				position: absolute;
				width: 160rpx;
				height: 60rpx;
				background: #64b6a8;
				border-radius: 37rpx;
				right: 118rpx;
				bottom: 54rpx;
				text-align: center;
				line-height: 60rpx;
				color: #fff;
			}

			.guan {
				position: absolute;
				width: 58rpx;
				height: 58rpx;
				border: 4rpx solid #ffffff;
				border-radius: 50%;
				left: 50%;
				transform: translateX(-50%);
				bottom: -100rpx;
				text-align: center;
				line-height: 48rpx;
				color: #fff;
				font-size: 56rpx;
			}
		}
	}

	.box {
		width: 100%;
		//padding-bottom: 120rpx;
		background-color: #fff;
		min-height: 100vh;
	}

	.tou {
		position: relative;
		width: 100%;
		height: 88rpx;
		text-align: center;
		line-height: 88rpx;
		font-size: 38rpx;
		color: #fff;

		.index-sousou {
			width: 40rpx;
			height: 40rpx;
		}

		.index-logo {
			width: 128rpx;
			height: 32rpx;
			left: 20rpx;
			margin-top: 24rpx;
		}

		image {
			margin-top: 24rpx;
			position: absolute;
		}
	}

	.bannerBox {
		width: 100%;
		//height: 400rpx;
		// background: #64b6a8;
		// padding-top: 28rpx;
		// margin-top: -4rpx;
		position: relative;

		.banner {
			// margin-left: 30rpx;
			width: 750rpx;
			height: 100%;
			overflow: hidden;
			// border-radius: 24rpx;

			.byTitle {
				width: 100%;
				height: 100%;
				position: absolute;
				top: 0;
				left: 0;
				background-color: rgba(0, 0, 0, 0.1);

				span {
					width: 650rpx;
					padding: 0 20rpx;
					position: absolute;
					bottom: 46rpx;
					font-size: 28rpx;
					font-weight: 500;
					color: #ffffff;
					white-space: nowrap;
					text-overflow: ellipsis;
					overflow: hidden;
				}
			}
		}

		.semiCircle {
			position: absolute;
			bottom: 0rpx;
			left: 0rpx;
			width: 750rpx;
			height: 31rpx;
			margin-bottom: -1rpx;
			border-top-right-radius: 50rpx;
			border-top-left-radius: 50rpx;
			background: #EFF1F3;
		}
	}

	.Ptop {
		/* #ifdef H5 || APP-PULS */
		// padding-top: 104rpx;
		margin-top: 98rpx;
		/* #endif */
		/* #ifdef H5*/
		// padding-top: 104rpx;
		margin-top: 0rpx;
		/* #endif */

		/* #ifdef MP  */
		// margin-top: 188rpx;
		/* #endif */
	}

	.fixed {
		// display: flex;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 40;
	}

	.cu-item .img {
		width: 100rpx;
		height: 100rpx;
		margin-left: 50%;
		transform: translateX(-50%);
	}

	.cu-item text {
		font-size: 30rpx;
		color: #333333;
	}

	.gonggao {
		width: 690rpx;
		height: 100rpx;
		margin-left: 32rpx;
		background: #ffffff;
		box-shadow: 0px 0px 6px 1px rgba(67, 67, 67, 0.16);
		border-radius: 12rpx;
		display: flex;

		.lis {
			width: 150rpx;
			padding: 10rpx 30rpx;
			height: 100%;
			display: flex;
			align-items: center;
			justify-content: center;
		}

		.gong {
			width: 518rpx;
			height: 60rpx;
			margin-top: 20rpx;
			// margin-left: 14rpx;
			border-left: 2rpx solid #d0d0d0;

			.text {
				width: 518rpx;
				font-size: 26rpx;
				line-height: 32rpx;
				margin-left: 12rpx;
				text-overflow: ellipsis;
				white-space: nowrap;
				overflow: hidden;
				color: #333333;
			}
		}
	}

	.tit1 {
		color: #333333;
		font-size: 38rpx;
		display: flex;
		justify-content: space-between;
		width: 690rpx;
		margin: 50rpx auto 24rpx;

		.tg {
			color: #64b6a8;
			display: flex;
			align-items: center;
			font-size: 30rpx;
			position: relative;

			.triangle {
				width: 0px;
				height: 0px;
				box-sizing: content-box;
				border-left: 8rpx solid transparent;
				border-right: 8rpx solid transparent;
				border-bottom: 15rpx solid #64b6a8;
				margin-left: 20rpx;
				transition: all 0.5s;
			}

			.fan {
				transition: all 0.5s;
				transform: rotate(180deg);
			}

			.kuang {
				position: absolute;
				left: -240rpx;
				top: 120%;
				background: #fff;
				// transform: translateY(-50%);
				width: 330rpx;
				padding: 0 30rpx;
				z-index: 20;
				box-shadow: 0 0 8rpx 4rpx rgba(0, 0, 0, 0.3);

				.item {
					height: 90rpx;
					line-height: 90rpx;
					border-bottom: 2rpx solid #e0e0e0;
				}

				.item:last-child {
					border-bottom: 0;
				}
			}
		}
	}

	.cardList {
		// margin-top: 50rpx;
		margin: 0rpx 20rpx;
		width: 710rpx;
		/* padding-bottom: 40rpx; */

		// 房屋
		.cardListLi {
			margin-bottom: 20rpx;
			background: linear-gradient(180deg, #FFF2E6 0%, #FFFFFF 40%);
			padding: 30rpx 20rpx;
			border-radius: 20rpx;

			.liTopBox {
				display: flex;
				align-items: center;
			}

			.liBottomBox {
				display: flex;
				margin-top: 20rpx;

				.personalInformation_left {
					display: flex;
					flex-direction: column;

					.personalInformation_image {
						width: 42rpx;
						height: 42rpx;
						border-radius: 42rpx;
					}
				}

				.personalInformation_right {
					width: calc(100% - 42rpx);
					padding-left: 10rpx;
					display: flex;
					flex-direction: column;
					justify-content: flex-end;

					.GR {
						display: flex;
						align-items: center;
						justify-content: space-between;

						.name {
							font-size: 24rpx;
							font-weight: 400;
							color: #333333;
							line-height: 40rpx;
						}
					}

					.GS {
						display: flex;
						align-items: center;
						justify-content: space-between;

						.corporation {
							font-size: 24rpx;
							font-weight: 400;
							color: #333333;
						}
					}

					.personalInformation_Time {
						font-size: 24rpx;
						font-weight: 400;
						color: #888888;
						margin-bottom: 6rpx;
						text-align: right;
					}

					.personalInformation_distance {
						font-size: 24rpx;
						font-weight: 400;
						color: #888888;
						text-align: right;
					}
				}
			}

			.image {
				background-color: #f8f8f8;
				width: 300rpx;
				height: 200rpx;
				border-radius: 20rpx;
			}

			.li_1 {
				margin-left: 24rpx;
				height: 200rpx;
				display: flex;
				flex-direction: column;
				justify-content: space-between;

				.tit {
					width: 366rpx;
					font-size: 32rpx;
					line-height: 44rpx;
					font-weight: 600;
					overflow: hidden;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-line-clamp: 1; //想要的行数
					-webkit-box-orient: vertical;

					.tagLabel {
						width: 70rpx;
						height: 40rpx;
						background: #E7F5F4;
						border-radius: 4rpx;

						vertical-align: top;
						// background: #64b6a8;
						color: #0FA291;
						font-size: 24rpx;
						text-align: center;
						width: 106rpx;
						margin-right: 10rpx;
						padding: 8rpx 11rpx;
						border-radius: 4rpx;
					}
				}

				.neirong_1 {
					width: 366rpx;
					font-size: 24rpx;
					color: #666666;
					display: flex;
					align-items: center;

					.price {
						color: red;
						font-size: 32rpx;
						font-weight: 600;
					}

					.neir_css {
						flex: 1;
						line-height: 32rpx;
						overflow: hidden;
						text-overflow: ellipsis;
						display: -webkit-box;
						-webkit-line-clamp: 1; //想要的行数
						-webkit-box-orient: vertical;
					}

					.neir_css:nth-child(2n) {
						margin-left: 10rpx;
					}

					.neir_css:nth-child(2n-1) {
						margin-right: 10rpx;
					}
				}
			}
		}

		// .li {
		// 	display: flex;
		// 	align-items: center;
		// 	padding-bottom: 30rpx;
		// 	margin-bottom: 30rpx;
		// 	border-bottom: 2rpx solid #e0e0e0;

		// 	image {
		// 		background-color: #f8f8f8;
		// 		width: 300rpx;
		// 		height: 200rpx;
		// 		border-radius: 20rpx;
		// 	}

		// 	.li_1 {
		// 		margin-left: 24rpx;
		// 		height: 200rpx;
		// 		display: flex;
		// 		flex-direction: column;
		// 		justify-content: space-between;

		// 		.tit {
		// 			width: 366rpx;
		// 			font-size: 36rpx;
		// 			line-height: 44rpx;
		// 			font-weight: 600;
		// 			overflow: hidden;
		// 			text-overflow: ellipsis;
		// 			display: -webkit-box;
		// 			-webkit-line-clamp: 2; //想要的行数
		// 			-webkit-box-orient: vertical;

		// 			.tagLabel {
		// 				vertical-align: top;
		// 				background: #64b6a8;
		// 				color: #fff;
		// 				font-size: 24rpx;
		// 				text-align: center;
		// 				width: 106rpx;
		// 				margin-right: 10rpx;
		// 				padding: 4rpx 6rpx;
		// 				border-radius: 4rpx;
		// 			}
		// 		}

		// 		.neirong_1 {
		// 			width: 366rpx;
		// 			font-size: 24rpx;
		// 			color: #666666;
		// 			display: flex;
		// 			align-items: center;

		// 			.price {
		// 				color: red;
		// 				font-size: 30rpx;
		// 				font-weight: 600;
		// 			}

		// 			.neir_css {
		// 				flex: 1;
		// 				overflow: hidden;
		// 				text-overflow: ellipsis;
		// 				display: -webkit-box;
		// 				-webkit-line-clamp: 1; //想要的行数
		// 				-webkit-box-orient: vertical;
		// 			}

		// 			.neir_css:nth-child(2n) {
		// 				margin-left: 10rpx;
		// 			}

		// 			.neir_css:nth-child(2n-1) {
		// 				margin-right: 10rpx;
		// 			}
		// 		}
		// 	}
		// }

		// .li:last-child {
		// 	border-bottom: 0rpx solid #e0e0e0;
		// }
	}

	.down {
		height: 60rpx;
		line-height: 60rpx;
		// border-top: 2rpx solid #d0d0d0;
		text-align: center;
	}

	.none {
		text-align: center;

		image {
			width: 430rpx;
			margin-bottom: 16rpx;
		}

		view {
			height: 40rpx;
			line-height: 40rpx;
			color: #666;
		}
	}
</style>